<template>
  <div>
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/manage/index' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>用户管理</el-breadcrumb-item>
      <el-breadcrumb-item>公众号审核</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="content">
      <el-table
        :data="branchList"
        style="width: 100%">
        <el-table-column
          type="index"
          width="50">
        </el-table-column>
        <el-table-column
          prop="brandName"
          label="名称"
          width="180">
        </el-table-column>
        <el-table-column
          prop="brandSlogan"
          label="品牌标语"
          width="180">
        </el-table-column>
        <el-table-column
          prop="address"
          label="地址">
          <template slot-scope="scope">
            <span>{{ scope.row.province }}</span>
            <span>{{ scope.row.city }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="principalName"
          label="公司名称">
        </el-table-column>
        <el-table-column
          prop="contactPhone"
          label="联系方式">
        </el-table-column>
        <el-table-column
          label="操作">
          <template slot-scope="scope">
            <el-popover
              placement="top"
              width="160"
              v-model="passAuditing">
              <p>确定批准{{ scope.row.branchName }}通过吗？</p>
              <div style="text-align: right; margin: 0">
                <el-button size="mini" type="text" @click="passAuditing = false">取消</el-button>
                <el-button type="primary" size="mini" @click="subPass(scope.$index)">确定</el-button>
              </div>
              <el-button slot="reference" size="small" type="primary">通过</el-button>
            </el-popover>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  name: 'branch-list',
  data () {
    return {
      url: {
        list: '/branch/register/list',
        approve: '/branch/approve'
      },
      branchList: [],
      allData: [],
      passAuditing: false
    }
  },
  methods: {
    initBranchList () {
      this.$ajax.post(this.url.list)
        .then(res => {
          if (res.data.success) {
            res.data.data && res.data.data.forEach(item => {
              this.branchList.push(item.branchInfo)
            })
          }
          this.allData = res.data.data
        })
    },
    subPass (index) {
      let branchKey = this.allData[index].branchKey
      let params = {
        branchKey,
        isApprove: true
      }
      this.$ajax.post(this.url.approve, JSON.stringify(params))
        .then(res => {
          if (res.data.success) {
            this.$message.success('审核通过')
          }
        })
      this.passAuditing = false
    }
  },
  created () {
    this.initBranchList()
  }
}
</script>

<style scoped>

</style>
